﻿<%@ Page Title="电池组图形数据分析" Language="C#" MasterPageFile="~/Web/Main.Master" AutoEventWireup="true" CodeBehind="groupDetailInfoChart.aspx.cs" Inherits="BOMS.WebUI.Web.RealStatus.groupDetailInfoChart" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link rel="stylesheet" href="../amcharts/images/style.css" type="text/css" />
        <script src="../amcharts/amcharts/amcharts.js" type="text/javascript"></script>         
        <script type="text/javascript">
            $(document).ready(function () {
                init();
            });
            var chart;
            var average = 0;
            function init() {
                var strChartData = $("#<%=JsonData1.ClientID %>").val();

                //                strChartData = [
                //                 { "BatteryID": 1, "Vval": 2.24, "Rval": 0.24, "Tval": 25.30 },
                //                 { "BatteryID": 2, "Vval": 2.23, "Rval": 0.66, "Tval": 25.70 },
                //                 { "BatteryID": 3, "Vval": 2.23, "Rval": 0.22, "Tval": 25.20 },
                //                 ];
                //  alert(strChartData);
                var jsonObj = eval(strChartData);

                var valType = $("input:radio[name$=rbl][checked]").val();
                AmChartsBind_column(jsonObj, valType);

            }



            function AmChartsBind_column(chartData, valType) {
                // SERIAL CHART
                chart = new AmCharts.AmSerialChart();
                chart.dataProvider = chartData;
                chart.categoryField = "BatteryID";
                chart.startDuration = 1;

                // AXES
                // category
                var categoryAxis = chart.categoryAxis;
                categoryAxis.labelRotation = 90;
                categoryAxis.gridPosition = "start";

                // value
                // in case you don't want to change default settings of value axis,
                // you don't need to create it, as one value axis is created automatically.

                // GRAPH
                var graph = new AmCharts.AmGraph();
                graph.valueField = valType;
                graph.balloonText = "[[category]]: [[value]]";
                graph.type = "column";
                graph.lineAlpha = 0;
                graph.fillAlphas = 0.8;
                chart.addGraph(graph);

                chart.write("chartdiv");
            }
        </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<table class="usertableborder" cellspacing="1" cellpadding="3" width="98%" align="center"
        border="0">
        <tr>
            <th colspan="3"><asp:Label runat="server" ID="lbIntro"></asp:Label></th>
        </tr>
        <tr>
            <td class="protablerow3" align="right" width="15%">
                Y轴显示：
            </td>
            <td class="protablerow1" align="left" >
                <asp:RadioButtonList ID="rbl" runat="server" AutoPostBack="true" RepeatDirection="Horizontal">
                    <asp:ListItem Value="Vval" Selected="True">电压</asp:ListItem>
                    <asp:ListItem Value="Rval">内阻</asp:ListItem>
                    <asp:ListItem Value="Tval">温度</asp:ListItem>
                </asp:RadioButtonList>
            </td>   
            <td class="usertablerow1" align="left" width="10%"><asp:Button ID="btn_back" runat="server" Text="返 回" class="btnbg" /></td>
        </tr>
    </table>
    <table class="usertableborder" cellspacing="1" cellpadding="3" width="98%" align="center" border="0">
        <tr>
            <td align="center">
                <table width="100%" height="300" border="0" cellspacing="1" cellpadding="2">
                    <tr>
                        <td width="100%" align="center">                            
                          <div id="chartdiv" style="width: 100%; height: 400px;"></div>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
          <asp:TextBox ID="JsonData1"  runat="server" ClientIDMode="Static" 
        Visible="True" style="display:none"></asp:TextBox>
</asp:Content>